function zoomIMG(id) {
	$("#zoom").remove();
	var image=$("#3dview-"+id+"-image");
	var img=new Image();
	img.src=image.attr("src");
	$("body").append("<div id='zoom' parent='"+id+"'><img src='images/exit.png' height='25px' id='exit-button'><img src='images/left.png' height='50px' id='arrleft'><img src='images/right.png' height='50px' id='arrright'></div>");
	var zoom=$("#zoom");
	var exit_button=$("#exit-button");
	exit_button.mouseover(function() {
		this.src='images/exit-a.png';
	});
	exit_button.mouseout(function() {
		this.src='images/exit.png';
	});
	exit_button.click(function() {
		zoom.remove();
	});
	zoom.click(function() {
		zoom.remove();
	});
	zoom.css({
		"position": "fixed", 
		"left": $(window).width()/2-img.width/2+"px", 
		"top": $(window).height()/2-img.height/2+"px",
		"width": img.width+"px",
		"height": img.height+"px",
		"background": "url("+img.src+") no-repeat",
		/*"text-align": "right",*/
		"border": "3px solid #444444",
		"z-index": "100"
	});
	exit_button.css({
		"position":"absolute",
		"top":"0px",
		"right":"0px"
	});
	arrow_left=$("#arrleft");
	arrow_right=$("#arrright");
	arrow_left.css({
		"position":"absolute",
		"top":(img.height/2-50/2)+"px",
		"left":"0px"
	});
	arrow_right.css({
		"position":"absolute",
		"top":(img.height/2-50/2)+"px",
		"right":"0px"
	});
	arrow_left.mouseover(function() {
		this.src='images/left-a.png';
	});
	arrow_left.mouseout(function() {
		this.src='images/left.png';
	});
	arrow_right.mouseover(function() {
		this.src='images/right-a.png';
	});
	arrow_right.mouseout(function() {
		this.src='images/right.png';
	});
	arrow_left.click(function() {
		id=$("#zoom").attr("parent");
		var value=$( "#3dview-"+id+"-slider" ).slider( "option", "value" );
		$( "#3dview-"+id+"-slider" ).slider( "value" , value-1 );
		zoomIMG(id);
	});
	arrow_right.click(function() {
		id=$("#zoom").attr("parent");
		var value=$( "#3dview-"+id+"-slider" ).slider( "option", "value" );
		$( "#3dview-"+id+"-slider" ).slider( "value" , value+1 );
		zoomIMG(id);
	});
};
$(document).ready(function() {
	//Preload iface
	var IfaceImage=new Array();
	IfaceImage[0]=new Image(); IfaceImage[0].src="images/exit.png";
	IfaceImage[1]=new Image(); IfaceImage[1].src="images/exit-a.png";
	IfaceImage[2]=new Image(); IfaceImage[2].src="images/left.png";
	IfaceImage[3]=new Image(); IfaceImage[3].src="images/left-a.png";
	IfaceImage[4]=new Image(); IfaceImage[4].src="images/right.png";
	IfaceImage[5]=new Image(); IfaceImage[5].src="images/right-a.png";
	
	$(".3dview").each(function(id) {
		var model_path=$(this).attr("model");
		var ajax_count=0;
		$.get(model_path+"/model-info.txt", function(data) {ajax_count=parseInt(data);});
		var acount=$(this).attr("slides");
		//Setup
		$(this).html('<img id="3dview-'+id+'-image" src="'+model_path+'/0.jpg" width=400 onclick="zoomIMG('+id+')"><br><div id="3dview-'+id+'-slider"></div>');
		$(this).attr('style','width:400;padding: 10px;');
		//Preload images
		var TempImage=new Array();
		for(var i=0; i<acount; i++) {
			TempImage[i]=new Image();
			TempImage[i].src=model_path+"/"+i+".jpg";
		}
		
		//Control
		$( "#3dview-"+id+"-slider" ).slider({
			min:0,
			max:acount-1,
			slide: function(event, ui) {
				var value=$( "#3dview-"+id+"-slider" ).slider( "option", "value" );
				
				$("#3dview-"+id+"-image").attr('src',model_path+"/"+value+".jpg");
			},
			change: function(event, ui) {
				var value=$( "#3dview-"+id+"-slider" ).slider( "option", "value" );
				
				$("#3dview-"+id+"-image").attr('src',model_path+"/"+value+".jpg");
			}
		});
	});
	$('body').keydown(function (e) {
	//left - 37
	//right - 39
	//alert(e.which);
if($("#zoom")[0]) { 
	id=$("#zoom").attr("parent");
	var value=$( "#3dview-"+id+"-slider" ).slider( "option", "value" );
	
	if(e.which==39) $( "#3dview-"+id+"-slider" ).slider( "value" , value+1 );
	if(e.which==37) $( "#3dview-"+id+"-slider" ).slider( "value" , value-1 );
	
	zoomIMG(id);
	if(e.which==27) $("#zoom").remove();
}
	//alert("3dview-"+id+"-slider");
	});
});
